<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="AAuto" /> 
<title>ele节点属性和方法</title>
<link href="../style.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="maincontent">
<h1>ele节点属性和方法</h1>
 <div class="desc">参考:<a href="../libraries/std/web/html.html"></a> <a href="webform.html">创建web窗体</a> <a href="html.html#dom"></a> <a href="getele.html">使用web窗体获取ele对象</a></div>
  <div>
    <h2>节点(node)、元素(element)</h2>
    <p>根据 <a href="html.html">HTML DOM(HTML文档对象模型)</a>，HTML 文档中的每个组成部份都是一个节点。    </p>
    <ul>
      <li>整个文档( document )是文档根节点 </li>
      <li>每个 HTML 标签是一个元素(element)节点 </li>
      <li>包含在 HTML 元素中的文本是文本节点 </li>
      <li>每一个 HTML 属性是一个属性节点 </li>
      <li>注释属于注释节点 </li>

    </ul>  
    <p><br />
    相应的,在AAuto中:</p>
    <ul>
      <li>使用 <a href="getele.html#document">wb.document</a> <a href="getele.html#getDoc">wb.getDoc(框架名)</a> 可以获取一个HTML文档的document节点. </li>
      <li>而使用 <a href="getele.html#getEle">wb.getEle(元素名字或ID)</a> 等函数可以获取element元素节点,element对象返回的变量在AAuto中约定以缩写ele表示.</li>
      <li>使用元素节点的 ele.innerText 属性则可以获取文本节点.<br />
      而使用ele.innerHTML则可获取包含在元素节点内部的HTML源码.</li>
      <li>使用ele.getAttribute(属性名字) 则可以获取属性节点,用 ele.setAttribute(属性名字,新的值) 则可以修改属性节点的值, 也可以直接使用 ele.属性名字 = 新的值. </li>
    </ul>
    <p>下面是一个超链接的HTML源码:</p>
    <pre>&lt;a id=&quot;myid&quot; href=&quot;http://www.ecranesoft.com/doc/html/&quot; onclick=&quot;alert('你点了我')&quot;&gt;
    点这里&lt;b&gt;获取更多HTML教程&lt;/b&gt;
&lt;/a&gt;
    </pre>
    <p>上面的HTML源码&lt;a&gt;........&lt;/a&gt;就是一个元素节点<br />
      使用 <span class="bluefont">ele = wb.getEle(&quot;myid&quot;)</span> 就可以在web窗体中获取该节点对象.<br />
      而使用 <span class="bluefont">ele.href</span> 就可以读写超链接属性.<br />
      属性 ele.onclick 是一个事件,on开头的属性一般都表示一个事件,click是鼠标单击的意思,鼠标单击超链接时触发这个事件,事件里写的是javascript脚本,我们使用 <span class="bluefont">ele.fireEvent(&quot;onclick&quot;) </span>可以触发这个事件,自动执行里面的脚本.<br />
      而使用 <span class="bluefont">str = ele.innerText </span>我们会获取内部的文本节点,即&quot;<span class="string">点这里获取更多HTML教程</span>&quot;<br />
      使用 <span class="bluefont">str = ele.innerHTML </span>会获取到内部的源代码,即&quot;<span class="string"><span class="string"><span class="string">点这里&lt;b&gt;获取更多HTML教程&lt;/b&gt;</span></span></span><span class="comment"></span>&quot;<br />
      <br />
    下面是该节点呈现在网页上的效果:</p>
    <pre><a href="http://www.ecranesoft.com/doc/html/" onclick="alert('你点了我')">
点这里<b>获取更多HTML教程</b></a></pre>
    <p>AAuto支持标准的HTML DOM对象,可以直接使用DOM对象的属性和方法.<br />
    而且AAuto的语法与Javascript很接近,使用AAuto与Javascript也可以很容易的直接交互(参考:<a href="doScript.html">wb.doScript</a> <a href="external.html">wb.external</a>)　,所以使用AAuto进行web编程有无可比拟的优势,而所有标准的网页教程都可以作为AAuto web编程的重要参考资料.我为大家整理了一系列的HTML、以及HTML DOM有关的教程,您可以点下面的链接在线浏览或直接下载(每教程首页顶部有下载CHM电子版的链接) <a href="http://www.ecranesoft.com/doc/html/" title="HTML DOM教程,Javascript教程" target="_blank">http://www.ecranesoft.com/doc/html</a></p>
    <p>下面我们详细介绍ele对象在web模拟自动化中常用的一些属性和方法,大家要注意并不是所有的属性和方法都会出现在快手开发环境的自动提示列表中,因为不同的ele节点有不同的属性和方法,而这需要在运行时才能获取,在设计时快手是无法自动感知的.</p>
  </div>
<div>
  <h2>ele.innerHTML</h2>
  <p>&nbsp;</p>
  ele.innerHTML
  可以获取一个节点内部的HTML源码,例如:
  <pre>ele = wb.document.all(1)
str = ele.innerHTML</pre>
</div>
<div>
  <h2>ele.innerText</h2>
  <p>ele.innerText 可以获取一个节点内部的文本内容(去除HTML源码),例如:<br />
  </p>
  <pre>ele = wb.document.all(1)
str = ele.innerText
</pre>
</div>
<div>
  <h2>ele.getAttribute</h2>
  <p>&nbsp;</p>
  <strong>1、函数原型</strong>
  <pre>value = ele.getAttribute( 属性名字 )</pre>
  <p><strong>2、函数说明</strong></p>
  <p>返回一个element元素节点指定名字的属性值,也可以直接使用 <span class="bluefont">ele.属性名字</span> 来访问属性值</p>
  <p><strong>3、调用示例</strong> </p>
  <pre><span class="comment">//遍历所有超链接</span>
for(k,ele in wb.eachLinks()){
    io.print( ele.getAttribute(&quot;href&quot;) )
    io.print( ele.href ) <span class="comment">//ele.href的作用与ele.getAttribute(&quot;href&quot;) 是一样的</span>
}
</pre>
</div>
<div>
  <h2>ele.setAttribute</h2>
  <p>&nbsp;</p>
  <strong>1、函数原型</strong>
  <pre>ele.setAttribute( 属性名字,新的值 )</pre>
  <p><strong>2、函数说明</strong></p>
  <p>修改一个element元素节点指定名字的属性值,也可以直接使用<span class="bluefont"> ele.属性名字 = 新的值</span> 直接修改.</p>
  <p><strong>3、调用示例</strong></p>
  <pre>//让所有超链接在当前窗口打开
for(k,ele in wb.eachLinks()){
	ele.target =&quot;_self&quot;
}
</pre> 
  <br />
  上面的代码可以禁止链接时新开窗口,通常可以将上面的代码写在 <a href="event.html#DownloadComplete">wb.DownloadComplete</a> 事件函数中,在每一个网页打开以后自动修改所有的超链接.</div>
<div>
  <h2>ele.click()  <a name="click" id="click"></a></h2>
  <p><strong>1、函数原型：</strong><br />
</p>
  <pre>ele.click()</pre>
  <p><strong>2、函数说明：</strong><br />
    <br />
    模拟鼠标自动点击节点,该函数并不使用真正的鼠标,而是在后台发送指令控制节点.<br />
  </p>
</div>
<div>
  <h2>ele.value</h2>
  <p>&nbsp;</p>
  <p><strong>1、函数原型：</strong><br />
  </p>
  <pre>
value = ele.value
ele.value = value
</pre>
  <p><br />
    <strong>2、函数说明：</strong><br />
  </p>
  <p>如果ele是form表单中的控件(例如input节点,按钮或输入框等),那么节点有value属性可以读写控件的数据.</p><strong> </strong>
</div>
<div>
  <h2>ele.form.submit<a name="submit" id="submit"></a></h2>
  <p>&nbsp;</p>
  <p><strong>1、函数原型：</strong><br />
  </p>
  <pre>ele.form.submit()</pre>
  <p><strong>2、函数说明：</strong><br />
    <br />
    如果ele是form表单中的控件(例如input节点,按钮或输入框等),那么节点有form属性指向表单容器节点.而form节点有submit()方法可以自动提交表单.</p>
  <p><strong>3、调用示例：</strong><br />
  </p>
  <pre>ele = wb.getEle("username")
ele.value = "用户名"

ele = wb.getEle("password")
ele.value = "密码"

ele.form.submit()</pre>
</div>

<div>
  <h2>ele.fireEvent<a name="fireEvent" id="fireEvent"></a></h2>
  <p>&nbsp;</p>
  <p><strong>1、函数原型：</strong><br />
  </p>
  <pre>
ele.fireEvent( 脚本事件名 )</pre>
  <p><strong>2、函数说明：</strong><br />
  </p>
  <p>如果节点存在事件属性,例如onclick,onchange等属性,这些属性通常在鼠标键盘操作时触发,在HTML源码中你可以在该元素的源码中看到on开头有属性名字,而属性的值通常是一段javascript脚本.<br />
    <br />
  执行<a href="#click">ele.click</a> 或 <a href="#submit">ele.submit</a> 时并不能触发事件,你需要调用 ele.fireEvent来触发该事件.<br />
  事件中的js脚本通常会使用this参数表示该element节点自身,这时候使用 <a href="doScript.html">wb.doScript</a> 就比较麻烦,而使用 ele.fireEvent 非常方便.<br />
  </p>
  <p><strong>3、调用示例：</strong><br />
  </p>
  <pre>ele=wb.getEle(&quot;options&quot;) <span class="comment">//获取下拉选框</span>节点
ele.selectedIndex=10  
ele.fireEvent(&quot;onchange&quot;) 

ele=wb.getEle(&quot;form1&quot;)<span class="comment"> //获取表单节点</span>
ele.target=&quot;_self&quot;;
ele.fireEvent(&quot;onsubmit&quot;)</pre>
  <p></p>
</div>
 
</div></body>
</html>